﻿
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <link href="~/Content/Css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="~/Content/Css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <link href="~/Content/Css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="~/Content/Css/animate.css" rel="stylesheet">
    <link href="~/Content/Css/style.css?v=4.1.0" rel="stylesheet">
    <link href="~/Content/Css/plugins/multiselect/bootstrap-multiselect.css" rel="stylesheet" />
    <style> 
        .ibox {
            margin-bottom: 0px;
        }

        .ibox-content {
            padding: 15px 20px 0px 20px;
        }

        .multiselect-container input[type="checkbox"] {
            margin-top: 7px;
        }

        .RoleIDLaber {
            padding: 8px 0 0 0;
        }
    </style>
</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight" style="padding:10px;">
        <div class="ibox float-e-margins">
            @*<div class="ibox-title">
            <h5>费用列表</h5>
        </div>*@



            @*<div class="panel panel-default" style="margin-top:10px;margin-bottom:10px;">
                <div class="panel-heading">
                    <strong>查询条件</strong>
                </div>
                <div class="panel-body">
                    <div class="form-group col-xs-4">
                        <label class="col-xs-1 control-label RoleIDLaber">地址：</label>
                        <div class="col-xs-11">
                            <select id="Address" class="form-control input-sm" name="Address" style="padding:0px;padding-left:10px;height:37px;">
                                <option value="" selected="selected">全部</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-xs-1">
                        <button id="btn" name="btn" class="btn btn-primary pull-right" type="button" style="margin-right:50px;">
                            <i class="fa fa-check"></i>&nbsp;同&nbsp;步
                        </button>
                    </div>
                </div>
            </div>*@

            <div class="panel panel-default" style="margin-top:10px;margin-bottom:10px;">
                <div class="panel-heading">
                    <strong>查询条件</strong>
                </div>
                <div class="panel-body">
                    <div class="pull-left" style="width:500px;">
                        <div class="col-xs-1" style="padding:6px 0 0 0;">地址：</div>
                        <div class="col-xs-11" style="padding:0 0 0 0;">
                            <select id="Address" class="form-control input-sm" name="Address" style="padding:0px;padding-left:10px;height:37px;">
                                <option value="" selected="selected">全部</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-xs-1">
                        <button id="btn" name="btn" class="btn btn-primary pull-right" type="button">
                            &nbsp;同&nbsp;步
                        </button>
                    </div>
                </div>
            </div>



            <div class="ibox-content" style="padding:15px;">
                <div class="btn-group hidden-xs" id="exampleToolbar" role="group">
                    @*<button id="insertBtn" type="button" class="btn btn-outline btn-default">
                    <i class="glyphicon glyphicon-plus" aria-hidden="true"></i>
                </button>
                <button id="editBtn" type="button" class="btn btn-outline btn-default">
                    <i class="glyphicon glyphicon-edit" aria-hidden="true"></i>
                </button>
                <button id="deleteBtn" type="button" class="btn btn-outline btn-default">
                    <i class="glyphicon glyphicon-trash" aria-hidden="true"></i>
                </button>*@
                    <button id="refreshBtn" type="button" class="btn btn-outline btn-default">
                        <i class="glyphicon glyphicon-refresh" aria-hidden="true"></i>
                    </button>

                </div>
                <table id="table" data-mobile-responsive="true"></table>
            </div>
        </div>
        @* 用来传递消息的隐藏域 *@
    </div>



    <!-- 全局js -->
    <script type="text/javascript" src="~/Scripts/jquery.min.js?v=2.1.4"></script>
    <script type="text/javascript" src="~/Scripts/bootstrap.min.js?v=3.3.6"></script>
    <!-- 自定义js -->
    <script type="text/javascript" src="~/Scripts/content.js?v=1.0.0"></script>
    <!-- Bootstrap table -->
    <script type="text/javascript" src="~/Scripts/plugins/bootstrap-table/bootstrap-table.min.js"></script>
    <script src="~/Scripts/plugins/bootstrap-table/extensions/export/bootstrap-table-export.js"></script>
    <script src="~/Scripts/plugins/bootstrap-table/extensions/export/tableExport.jquery.plugin-master/tableExport.js"></script>
    @*<script src="~/Scripts/plugins/bootstrap-table/extensions/export/bootstrap-table-export.min.js"></script>*@
    <script type="text/javascript" src="~/Scripts/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
    <!-- layer javascript -->
    <script type="text/javascript" src="~/Scripts/plugins/layer/layer.min.js"></script>
    <script src="~/Scripts/plugins/layer/laydate/laydate.js"></script>
    <script src="~/Scripts/TimeObjectUtil.js"></script>
    <script src="~/Scripts/plugins/multiselect/bootstrap-multiselect.js"></script>
    <script type="text/javascript">
        $(function () {
            GetSoftwares();
            initTable();
        });

        var $table = $('#table');
        function initTable() {
            $table.bootstrapTable({
                url: '/PumpWalletRunnings/IndexAsync',            //数据来源地址
                method: 'post',                     //数据请求方式
                striped: true,                      //是否显示行间隔色
                cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
                pagination: true,                   //是否启用分页
                sidePagination: 'server',           //在服务器端分页
                queryParams: queryParams,           //传递参数
                pageNumber: 1,                      //初始化加载第一页，默认第一页
                pageSize: 20,                       //每页的记录行数（*）
                pageList: [10, 20, 30, 40, 50],     //可供选择的每页的行数（*）
                clickToSelect: true,                //是否启用点击选中行
                //toolbar: "#tableToolBar",
                height: getHeight(), 
                exportDataType: "basic",              //basic', 'all', 'selected'.
                exportTypes: ['excel'],
                exportOptions: { fileName: '123' },
                toolbar: '#exampleToolbar',
                iconSize: 'outline',
                icons: {
                    refresh: 'glyphicon-repeat',
                    columns: 'glyphicon-list'
                },
                toolbar: '#exampleToolbar',
                columns: [{
                    width: 38,
                    field: 'aaaaaaa',
                    checkbox: true,
                }, {
                    title: '编号',
                    align: 'center',
                    field: 'ID',
                    width: 40
                }, {
                    field: 'BlockNumber',
                    title: '块',
                    align: 'center'
                }, {
                    field: 'Hash',
                    title: '唯一标识',
                    align: 'center'
                }, {
                    field: 'From',
                    title: '转出钱包',
                    align: 'center',
                }, {
                    field: 'To',
                    title: '转入钱包',
                    align: 'center'
                }, {
                    field: 'Value',
                    title: '金额',
                    align: 'center'
                }, {
                    field: 'GasPrice',
                    title: '费用',
                    align: 'center'
                }, {
                    field: 'TimeStamp',
                    title: '时间',
                    align: 'center',
                    formatter: imeStampFormatter
                }
                ]
            });
        }

        //查询的参数
        var queryParams = function (params) {
            var a = $('#Address').val();
            var temp = {
                pageSize: params.limit,                             //行数
                pageIndex: (params.offset / params.limit) + 1,      //页码 
                Address: $('#Address').val()
            };
            console.log(temp);
            console.log(params);
            return temp;
        };

        //获取表格高度
        function getHeight() {
            return $(window).height() - 180;
        }

        //刷新表格数据
        var refreshTable = function () {
            $table.bootstrapTable("refresh");
        }

        //刷新按钮
        $("#refreshBtn").click(function (e) {
            $table.bootstrapTable("refresh");
        });

        //搜索按钮
        $("#searchBtn").click(function (e) {
            $table.bootstrapTable("refresh");
        });

        function imeStampFormatter(value, row, index) {
            var time;
            $.ajax({
                url: '/PumpWalletRunnings/TimestampToDateTime',
                data: { timestamp: value },
                type: "post",
                async: false,
                success: function (data) {
                    time = data;
                }
            }); 

            return time;
        }

        $('#btn').click(function (e) {
            $.ajax({
                url: '/PumpWalletRunnings/PumpWalletAsync', 
                type: "post",
                async: false,
                success: function (data) {
                    $table.bootstrapTable("refresh");
                }
            }); 
        });

        function GetSoftwares() {
            $.getJSON("/PumpWalletRunnings/GetAddress",
                function (data) {
                    $("#Address").empty();//清空城市SELECT控件
                    $("<option></option>").val("").text("全部").appendTo($("#Address"));
                    $.each(data, function (i, item) {
                        $("<option></option>").val(item["Address"]).text(item["Remark"] + '[' + item["Address"] + ']').appendTo($("#Address"));
                    })
                });
        }
    </script>
</body>
</html>
